<template>
<view class='uni-icon' :style='style' />
</template>

<script setup lang="ts">
  import { IconProps } from '../props'
  import { useIconfont } from '../useIconfont'
  import { computed } from 'vue'
  const props = defineProps(IconProps)
  const {
  colors,
  svgSize,
  quot,
  isStr,
  } = useIconfont(props)
  const style = computed(() => {
      return `background-image: url(${quot.value}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='${svgSize.value}px' height='${svgSize.value}px'%3E%3Cpath d='M0 512.03c0 282.73 229.2 511.93 511.93 511.93s511.93-229.2 511.93-511.93C1023.86 229.29 794.66 0.1 511.93 0.1 229.2 0.09 0 229.29 0 512.03z m0 0' fill='${(isStr.value ? colors.value : colors.value[0]) || 'rgb(255,233,230)'}' /%3E%3Cpath d='M763.26 656.67a90.429 90.429 0 0 0-56.5-66.42 90.432 90.432 0 0 0-86.35 12.18V407.06a36.2 36.2 0 0 1 16.97-30.67 36.173 36.173 0 0 1 35-1.88l108.49 52.71a36.152 36.152 0 0 1 20.36 32.55v160.74c0 19.97-16.19 36.16-36.16 36.16h-1.81z m-307.38 0c-8.63-42.07-45.65-72.27-88.6-72.27-42.95 0-79.97 30.2-88.6 72.27h-19.89c-19.97 0-36.16-16.19-36.16-36.16v-289.3c0-19.97 16.19-36.16 36.16-36.16h289.3c19.97 0 36.16 16.19 36.16 36.16v289.3c0 19.97-16.19 36.16-36.16 36.16h-92.21zM421.64 451.1h54.32c9.99 0 18.08-8.1 18.08-18.08 0-9.99-8.1-18.08-18.08-18.08h-42.27l35.8-35.74c7.07-7.07 7.06-18.53-0.01-25.6-7.07-7.06-18.53-7.06-25.59 0.01l-40.43 40.4-40.43-40.4c-7.15-6.52-18.16-6.27-25.01 0.58-6.84 6.84-7.11 17.85-0.59 25.01l35.8 35.74h-42.1c-9.99 0-18.08 8.1-18.08 18.08 0 9.99 8.1 18.08 18.08 18.08h54.32v36.17h-54.32c-9.99 0-18.08 8.1-18.08 18.08s8.1 18.08 18.08 18.08h54.32v20.7c0 4.8 1.9 9.4 5.3 12.79 3.39 3.39 7.99 5.29 12.78 5.29h0.04c4.8 0 9.39-1.9 12.78-5.29a18.09 18.09 0 0 0 5.3-12.79v-20.72h54.32c9.99 0 18.08-8.1 18.08-18.08 0-9.99-8.1-18.08-18.08-18.08h-54.32v-36.16 0.01zM367.29 729c29.95 0 54.24-24.29 54.24-54.25s-24.29-54.24-54.24-54.24c-29.96 0-54.25 24.28-54.25 54.24S337.33 729 367.29 729z m307.38 0c29.96 0 54.24-24.29 54.24-54.25s-24.28-54.24-54.24-54.24-54.25 24.28-54.25 54.24S644.71 729 674.67 729z m0 0' fill='${(isStr.value ? colors.value : colors.value[1]) || 'rgb(238,121,92)'}' /%3E%3C/svg%3E${quot.value}); width: ${svgSize.value}px; height: ${svgSize.value}px;`
  })
</script>
